<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>详情页面</title>
    <script src="./script/main.js" type="module" id="index"></script>
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./css/detail.css">
</head>
<body>
    <div class="head"></div>
    <div class="detail" id="detail">
        <div class="opacityBottom" style="visibility:hidden">
            <div class="img1">
                 <img src="#" alt="">
                 <span>x</span>
                 <div class="left"><</div>
                 <div class="right">></div>
                </div>

        </div>
        <div class="detail_max">
            <p class="header_detail"><span>首页</span>><span>居家生活</span></p>
            <div class="detail_min">
                <div class="detail_left">
                    <div class="big_big_img"><img src="https://yanxuan-item.nosdn.127.net/8221c028b116dfc1aafcbc54d36d756d.jpg?type=webp&imageView&thumbnail=430x430&quality=95" alt="" id="bpic"></div>
                    <div class="big_img">
                        <img src="https://yanxuan-item.nosdn.127.net/8221c028b116dfc1aafcbc54d36d756d.jpg?type=webp&imageView&thumbnail=430x430&quality=95" alt="">
                        <div id="sf"></div>
                    </div>
                    <div class="min_img">
                        <ul>
                        <li>
                            <a href="">
                            <img src="https://yanxuan-item.nosdn.127.net/8221c028b116dfc1aafcbc54d36d756d.jpg?type=webp&imageView&thumbnail=78x78&quality=95" alt="">
                            </a>
                        </li>
                        <li>
                            <a href="">
                            <img src="https://yanxuan-item.nosdn.127.net/8221c028b116dfc1aafcbc54d36d756d.jpg?type=webp&imageView&thumbnail=78x78&quality=95" alt="">
                            </a>
                        </li>
                        <li>
                            <a href="">
                            <img src="https://yanxuan-item.nosdn.127.net/8221c028b116dfc1aafcbc54d36d756d.jpg?type=webp&imageView&thumbnail=78x78&quality=95" alt="">
                            </a>
                        </li>
                        <li>
                            <a href="">
                            <img src="https://yanxuan-item.nosdn.127.net/8221c028b116dfc1aafcbc54d36d756d.jpg?type=webp&imageView&thumbnail=78x78&quality=95" alt="">
                            </a>
                        </li>
                        <li>
                            <a href="">
                            <img src="https://yanxuan-item.nosdn.127.net/8221c028b116dfc1aafcbc54d36d756d.jpg?type=webp&imageView&thumbnail=78x78&quality=95" alt="">
                            </a>
                        </li>
                        </ul>
                    </div>
                </div>
                <div class="detail_right">
                    <div class="detail_right1">
                        <div class="text1" id="detail_text1">联想（Lenovo）拯救者R9000P 2021八核锐龙R7设计制图高色域全面屏轻薄笔记本电脑 高性能电竞游戏本 16英寸高色域165Hz全面屏笔记本电脑</div>
                        <div  class="text2"><span class="span1">98.7%</span><br><span class="span2">好评率></span></div>
                    </div>
                    <div class="middon">
                        <div class="middon1">
                        <p><span class="span1">价格</span><span class="jg span2">￥769</span></p>
                        <p><span class="span1">购物返</span><span class="span2">最高返76积分</span></p>
                        <p><span class="span1">邮费</span><span class="span2">满99元免邮，邮费8元</span></p>
                        <p><span class="span1">配送</span><span class="span2">全国配送</span></p>
                        </div>
                        <div class="middon2">
                            <p><span class="span1">严选自营</span><span class="span2">･ 严选自营    ･ 7天无忧退换    ･ 国内部分地区不可配送    
                            </span></p>
                            <p><span class="span1">规则</span><span class   ="span2">
                                ･ 首单全额返最高返150余额，点击查看 </span></p>
                            <p><span class="span1">备注</span><span class="span2">大家具送货安装及售后服务细则>></span></p>
                            </div>
                    </div>
                    <div class="shuliang">
                        <span>数量</span>
                        <div class="shuliangs"><span class="span_left">-</span><input type="text" value="1" id="inputs"><span class="span_right">+</span></div>
                    </div>
                    <input type="button" class="sub" id="sub" value="加入购物车">
                </div>

            </div>
        </div>
    </div>
    <div class="foot"></div>
</body>
</html>